<template>
    <el-form label-width="150px" :model="activityRemark">
        <el-form-item label="ID">
            <div class="detail">{{ activity.id }}&nbsp;</div>
        </el-form-item>

        <el-form-item label="负责人">
            <div class="detail"> {{ activity.ownerDo.name }}&nbsp;</div>
        </el-form-item>

        <el-form-item label="活动名称">
            <div class="detail">{{ activity.name }}&nbsp;</div>
        </el-form-item>

        <el-form-item label="开始时间">
            <div class="detail">{{ activity.startTime }}&nbsp;</div>
        </el-form-item>

        <el-form-item label="结束时间">
            <div class="detail">{{ activity.endTime }}&nbsp;</div>
        </el-form-item>

        <el-form-item label="活动预算">
            <div class="detail">{{ activity.cost }}&nbsp;</div>
        </el-form-item>

        <el-form-item label="活动描述">
            <div class="detail">{{ activity.description }}&nbsp;</div>
        </el-form-item>

        <el-form-item label="创建时间">
            <div class="detail">{{ activity.createTime }}&nbsp;</div>
        </el-form-item>

        <el-form-item label="创建人">
            <div class="detail">{{ activity.createByDo.name }}&nbsp;</div>
        </el-form-item>

        <el-form-item label="编辑时间">
            <div class="detail">{{ activity.editTime }}&nbsp;</div>
        </el-form-item>

        <el-form-item label="编辑人">
            <div class="detail">{{ activity.editByDo.name }}&nbsp;</div>
        </el-form-item>

        <el-form-item label="活动备注">
            <el-input v-model="activityRemark.noteContent" type="textarea" />
        </el-form-item>

        <el-form-item>
            <el-button type="primary" @click="activityRemarkSubmit()">提 交</el-button>
            <el-button @click="goBack">返 回</el-button>
        </el-form-item>

        <el-form-item>
            <el-table :data="activityRemarkPageInfo.list" style="width: 100%">
                <el-table-column type="index" label="序号" width="60" />
                <el-table-column property="noteContent" label="备注内容" />
                <el-table-column property="createTime" label="创建时间" />
                <el-table-column property="createByDo.name" label="创建人" />
                <el-table-column property="editTime" label="编辑时间" />
                <el-table-column property="editByDo.name" label="编辑人" show-overflow-tooltip />
                <el-table-column label="操作">
                    <template #default="scope">
                        <el-button type="primary" :icon="Edit" circle @click="edit(scope.row.id)" />
                        <el-button type="danger" :icon="Delete" circle @click="del(scope.row.id)" />
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination background layout="prev, pager, next, jumper, total" :total="activityRemarkPageInfo.total"
                :page-size="activityRemarkPageInfo.pageSize" @change="toPage" />
        </el-form-item>
    </el-form>
</template>

<script setup>

import { ref, onMounted, inject } from 'vue'

import { useRouter, useRoute } from 'vue-router'
import { doGet, doPost } from '../http/httpRequest'
import { showMessage } from '../util/message'



let activity = ref({
    ownerDo: {},
    createByDo: {},
    editByDo: {}
})

//返回
let router = useRouter()
const goBack = () => {
    router.back()
}

onMounted(() => {
    loadActivity()
    loadActivityRemarkList(1)
})

let route = useRoute()
//查询活动明细数据
const loadActivity = async () => {
    //获取活动id
    let id = route.params.activityId
    //查询活动明细数据

    let res = await doGet('/api/activity/' + id, {})
    if (res.data.code == 200) {
        activity.value = res.data.info
    } else {
        showMessage(res.data.msg, 'error')
    }

    // doGet('/api/activity/' + id,{}).then(res => {
    //     if (res.data.code == 200) {
    //         activity.value = res.data.info
    //     } else {
    //         showMessage(res.data.msg, 'error')
    //     }
    // })
}

//活动备注对象
let activityRemark = ref({})

let flushPage = inject('flush')

//活动提交
let activityRemarkSubmit = async () => {
    //活动id
    let activityId = route.params.activityId

    let resp = await doPost('api/activity/remark', {
        activityId: activityId,
        noteContent: activityRemark.value.noteContent
    })
    if (resp.data.code == 200) {
        showMessage(resp.data.msg, 'success')
        //局部刷新
        flushPage()
    } else {
        showMessage(resp.data.msg, 'error')
    }
}


//活动备注分页查询
let activityRemarkPageInfo = ref({})

const loadActivityRemarkList = async current => {
   let resp = await doGet('/api/activity/remarks',{
        current: current,
        activityId: route.params.activityId
   })
   if (resp.data.code == 200) {
        activityRemarkPageInfo.value = resp.data.info
   } else {
        showMessage(resp.data.msg, 'error')
   }
}

//分页
const toPage = current => {
    loadActivityRemarkList(current)
}
</script>

<style scoped></style>